<template>
  <div class="fee_record_page">
    <van-nav-bar
      title="代招费总记录"
      left-arrow
      @click-left="$router.push('/recommend_persons')"
    />

    <van-dropdown-menu>
      <van-dropdown-item title="筛选"  disabled v-model="value1"  :options="option1" />
      <van-dropdown-item :title="value2 ? allTypeObj[value2] : '请选择'" v-model="value2"  :options="option2" />
    </van-dropdown-menu>


    <div v-if="recordArr.length" class="record_list">
      <van-cell style="font-size: 12px">

        <!-- 非提现部分  -->
        <div v-show="value2 != 'e'">
          <van-row style="text-align: center; vertical-align: center; font-weight: bolder; font-size: 13px" align="center" type="flex" justify="space-between">
            <van-col span="8">时间</van-col>
            <van-col span="8">名称</van-col>
            <van-col span="8">金额(￥)</van-col>
          </van-row>
          <van-row type="flex" style="text-align:center" align="center" justify="space-between" v-for="item in recordArr" :key="item.id">
            <van-col span="8">{{item.createdate}}</van-col>
            <van-col span="8">{{item.name}}</van-col>
            <van-col span="8">
              <span :class="(value2 === 'a' || value2 === 'b') ? 'plus_symbol' : 'minus_symbol'">
                {{ ((value2 === 'a' || value2 === 'b') ? '&plus;': '&minus;')  + '&nbsp;' + (item.money / 1000).toFixed(2)}}
              </span>
            </van-col>
          </van-row>
        </div>


        <!--  提现记录   -->
        <div v-show="value2 === 'e'">
          <com-withdrawal-records :recordArr="recordArr"></com-withdrawal-records>
        </div>

      </van-cell>
      <van-pagination
        v-model="pageIndex"
        style="margin-top: 3px"
        :total-items="totalRecord"
        :items-per-page="pageSize"
        force-ellipses
        @change="handleChange"
      />
    </div>


    <van-divider style="margin-top: 99px" v-else>请选择分类查看</van-divider>




  </div>
</template>

<script>
  import cashToWay from '../../constants/cashToWay';
  import comWithdrawalRecords from '../../components/comWithdrawalRecords';
  const allTypeObj = {
    'a': '代招费到账',
    'b': '服务费到账',
    'c': '上家服务费',
    'd': '平台服务费',
    'e': '提现到账',
    'f': '企业用户提成到账',

  };

  export default {
    name: 'recommendFeeRecord',
    components: {
      comWithdrawalRecords,
    },
    data(){
      return {
        allTypeObj,
        cashToWay,
        recordArr: [
          {
            "id": 1,
            "createdate": "2020-10-09 16:51:42",
            "money": 441000,
            "name": "代招费到账",
            'acctype': 0,
          },
        ],
        value1: '',
        value2: '',
        option1: [],
        option2: [
          { text: '代招费到账', value: 'a' },
          { text: '服务费到账', value: 'b' },
          { text: '上家服务费', value: 'c' },
          { text: '平台服务费', value: 'd' },
          { text: '提现到账', value: 'e' },
          { text: '企业用户提成到账', value: 'f' },
        ],
        pageIndex: 1,
        pageSize: 1,
        totalRecord: 3,
      }
    },
    methods: {
      handleChange(value) {
        const params = {
          pageIndex: value,
          pageSize: this.pageSize,
        };

        // 加上接口
        // this._getBuyRecordList(params)
      },
    }
  }
</script>

<style lang="scss" scoped>
  .fee_record_page{
    width: 100%;
    .record_list{
      .plus_symbol{
        color: red;
      }
    }
  }
</style>
